@charset "utf-8";
@import "./theme/handle";
@import "./variable";
@import "./common_mixin";
@import "./mixin";
.el-input__inner,.el-textarea__inner{
  @include bg_color('content-bg1');
  @include set_border('color-primary');
  @include font_color('color-text-primary');

  &:disabled{
    @include bg_color('color-disabled');
    @include font_color('color-text-regular');
  }
}
.el-range-separator{
  @include font_color('color-text-regular');
}
.el-range-input{
  @include bg_color('content-bg1');
}
.el-popper{
  @include set_border('border-color-base');
  @include bg_color('content-bg1');
  span{
    @include font_color('color-text-regular');
  }
  .popper__arrow{
    @include border_color('background-color-base',bottom);
    &:after{
      @include border_color('background-color-base',bottom);
    }
  }
}
.el-select-dropdown__item.hover{
    @include bg_color('header-menu-hover');
}
/*Button*/
.el-button--primary,.el-button--default{
  @include bg_color('color-primary');
  @include border_color('color-primary');
  &:hover{
    opacity: 0.8;
  }
}
.el-button:not(.is-disabled){
  &.is-plain:active{
    @include bg_color('color-primary');
  }
  &.is-plain:focus, &.is-plain:hover{
    @include bg_color('color-primary');
  }
}

.el-button--success{
  @include bg_color('color-success');
  @include border_color('color-success');
  &:hover{
    opacity: 0.9;
  }
}
.el-button--warning{
  @include bg_color('color-warn');
  @include border_color('color-warn');
  &:hover{
    opacity: 0.9;
  }
}
.el-button--danger{
  @include bg_color('color-danger');
  @include border_color('color-danger');
  &:hover{
    opacity: 0.9;
  }
}
.el-button--info{
  @include bg_color('color-info');
  @include border_color('color-info');
  &:hover{
    opacity: 0.9;
  }
}
//右上角提示消息
.el-notification{
  @include bg_color('background-color-base');
  @include border_color('sidebar-bg1');
  .el-icon-success{
    @include font_color('color-success');
  }
  .el-icon-warning{
    @include font_color('color-warn');
  }
  .el-icon-info{
    @include font_color('color-info');
  }
  .el-icon-error{
    @include font_color('color-danger');
  }
  .el-notification__title{
    @include font_color('color-text-regular');
  }
  .el-notification__content{
    @include font_color('color-text-primary');
  }
  .el-notification__closeBtn{
    @include font_color('color-text-regular');
  }
}
//Number
.el-input-number__increase,.el-input-number__decrease{
  @include bg_color('border-color-base');
  @include set_border('color-primary');
  @include font_color('color-text-regular');
}
//DateCpicker
.el-date-range-picker__header>div{
  @include font_color('color-text-regular');
}
.el-picker-panel__icon-btn{
  @include font_color('color-text-regular');
}
.el-picker-panel__content{
  th{
    @include font_color('color-text-secondary');
  }
  .available a{
    @include font_color('color-text-secondary');
  }
  .in-range div{
    @include bg_color('header-menu-hover');
    &:hover{
      @include bg_color('sidebar-bg1');
    }
  }
  .start-date,.end-date{
    span{
      @include bg_color('color-primary');
    }
  }
  .next-month span{
    @include font_color('color-disabled');
  }
  .available.current a{
    @include font_color('color-primary');
  }
  .cell{
    @include font_color('color-text-secondary');
  }
  .current{
    @include font_color('color-primary');
  }
  .available.today span{
    @include font_color('color-primary');
  }
}
.el-picker-panel__footer{
  @include bg_color('border-color-base');
  @include border_color('header-menu-hover',top);
}


@mixin elButtonFormatForTable() {
  .el-button {
    background: none;
    border: none;
    padding: 0;
    margin-left: 5px;

    &.is-disabled {

      span,
      i {
        @include font_color('color-disabled');
      }
    }

    &:not(.is-disabled) {

      span,
      i {
        &:hover {
          @include font_color('border-color-lighter');
        }
        @include font_color('border-color-base');
        font-weight:600;
        font-size:$smFontSize;
        @include set_one_border('border-color-extra-light','bottom');
      }
    }
  }
}

@mixin paginator() {
  .pagination-container {
    margin-top: 20px;
    text-align: center;
    .el-pagination__jump,.el-pagination__total,.el-pagination__editor{
      @include font_color('color-text-secondary');
    }
    .el-input__inner{
      @include font_color('color-text-secondary');
    }
    .el-pagination {

      button.btn-prev,
      button.btn-next {
        height: 30px;
        line-height: 30px;
        text-align: center;
        background: none;
        @include set_border('border-color-base');
        @include font_color('color-text-regular');
        padding: 0;
        margin: 0;
        @include borderRadius(3px);
        &:disabled {
          @include bg_color('color-disabled');
        }
      }

      ul {
        .number {
          margin: 0 5px;
          padding: 0;
          height: 30px;
          line-height: 30px;
          @include borderRadius(3px);
        }

        .number:not(.active) {
          background: none;
          @include set_border('border-color-base');
          @include font_color('color-text-regular');
        }

        .number.active {
          @include bg_color('content-bg2');
          @include set_border('color-primary');
          @include font_color('color-primary');
        }
      }
    }

    .el-pagination__jump {
      margin: 0 10px;
    }
  }
}

@mixin elTableFormat() {
  .el-table {
    .el-checkbox__inner{
      @include set_border('color-primary');
      background: none;
    }
    .el-checkbox__input.is-checked,
    .el-checkbox__input.is-indeterminate {
      .el-checkbox__inner {
        @include bg_color('border-color-extra-light');
        &:before{
          @include bg_color('header-bg1');
        }
        &:after{
          @include set_one_border('header-bg1','right');
          @include set_one_border('header-bg1','bottom');
        }
      }
    }
    .el-table__header-wrapper {
      .el-table__header {

        .has-gutter {
          tr {
            th.is-leaf {
              @include bg_color('border-color-extra-light');
              .cell {
                @include font_color('color-text-primary');
                font-size: $baseFontSize;
              }
            }

            th.is-leaf:last-child {
              border-right: none;
            }
          }
        }
        tr {
          @include bg_color('border-color-extra-light');
        }
          th.is-leaf {
            @include bg_color('color-primary');

            .cell {
              @include font_color('color-text-primary');
              font-size: $baseFontSize;
            }
          }

          th.is-leaf:last-child {
            border-right: none;
          }
      }
    }
    .el-table__body-wrapper {
      tr {
        @include bg_color('content-bg1');
        &.el-table__row {
          &:hover {
            td {
              @include bg_color('color-primary');
            }
          }
        }

        &.el-table__row.el-table__row--striped {
          td {
            @include bg_color('border-color-extra-light');
          }

          &:hover {
            td {
              @include bg_color('color-primary');
            }
          }
        }

        td {
          height: 44px;
          border-bottom: none;

          .cell:after {
            @include clearFloat
          }

          .cell {
            .cell-normal-value {
              @include whiteSpace;
              @include font_color('color-text-regular');
            }

            .has-required-text:after {
              @include clearFloat
            }

            .has-required-text {
              .row-value {
                float: left;
                @include whiteSpace;
              }

              .required-icon {
                float: left;
                width: 10px;
                padding-left: 5px;
                padding-top: 5px;
                color: red;
                //font-size: 1.4rem;
                font-size: 22px;
              }
            }
          }
        }

        td:last-child {
          border-right: none;
        }
      }
    }
    .operate-button-column{
      @include font_color('color-primary');
      .el-button{
        span,i{
          @include font_color('color-primary');
          @include set_one_border('color-primary','bottom');
          &:hover{
            @include font_color('header-bg1');
            @include set_one_border('header-bg1','bottom');
          }
        }
      }
    }
  }
  .el-table--border {
    @include set_border('border-color-base');
    .el-checkbox__inner{
      @include set_border('color-primary');
      background: none;
    }
    .el-checkbox__input.is-checked,
    .el-checkbox__input.is-indeterminate {
      .el-checkbox__inner {
        @include bg_color('border-color-extra-light');
        &:before{
          @include bg_color('header-bg1');
        }
        &:after{
          @include set_one_border('header-bg1','right');
          @include set_one_border('header-bg1','bottom');
        }
      }
    }
    .el-table__header-wrapper {
      .el-table__header {

        .has-gutter {
          tr {
            th.is-leaf {
              @include set_one_border('border-color-base','right');
              @include set_one_border('border-color-base','bottom');
              //@include bg_color('background-color-base');
              @include bg_color('border-color-extra-light');
              .cell {
                @include font_color('color-text-primary');
                font-size: $baseFontSize;
              }
            }

            th.is-leaf:last-child {
              border-right: none;
            }
          }
        }
        tr {
          @include bg_color('border-color-extra-light');
        }
          th.is-leaf {
            @include set_one_border('border-color-base','right');
            @include set_one_border('border-color-base','bottom');
            @include bg_color('color-primary');

            .cell {
              @include font_color('color-text-primary');
              font-size: $baseFontSize;
            }
          }

          th.is-leaf:last-child {
            border-right: none;
          }
      }
    }

    .el-table__body-wrapper {
      tr {
        @include bg_color('content-bg1');
        &.el-table__row {
          &:hover {
            td {
              @include bg_color('color-primary');
            }
          }
        }

        &.el-table__row.el-table__row--striped {
          td {
            @include bg_color('border-color-extra-light');
          }

          &:hover {
            td {
              @include bg_color('color-primary');
            }
          }
        }

        td {
          height: 44px;
          @include set_one_border('border-color-base','right');
          border-bottom: none;

          .cell:after {
            @include clearFloat
          }

          .cell {
            .cell-normal-value {
              @include whiteSpace;
              @include font_color('color-text-regular');
            }

            .has-required-text:after {
              @include clearFloat
            }

            .has-required-text {
              .row-value {
                float: left;
                @include whiteSpace;
              }

              .required-icon {
                float: left;
                width: 10px;
                padding-left: 5px;
                padding-top: 5px;
                color: red;
                //font-size: 1.4rem;
                font-size: 22px;
              }
            }
          }
        }

        td:last-child {
          border-right: none;
        }
      }
    }
    .operate-button-column{
      @include font_color('color-primary');
      .el-button{
        span,i{
          @include font_color('color-primary');
          @include set_one_border('color-primary','bottom');
          &:hover{
            @include font_color('header-bg1');
            @include set_one_border('header-bg1','bottom');
          }
        }
      }
    }
  }
}

@mixin elDialogFormat() {
  .el-dialog {
    @include bg_color('content-bg1');
    @include borderRadius(5px);

    .el-dialog__header {
      padding:10px 20px;

      .el-dialog__title {
        @include font_color('color-text-primary');
        font-size: $baseFontSize;
      }
      .el-dialog__headerbtn{

        top:10px;
      }
      @include bg_color('color-primary');
      @include set_one_border('color-primary','bottom');
      border-top-left-radius: 5px;
      -webkit-border-top-left-radius: 5px;
      -moz-border-top-left-radius: 5px;
      -o-border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      -webkit-border-top-right-radius: 5px;
      -moz-border-top-right-radius: 5px;
      -o-border-top-right-radius: 5px;
    }
    .el-dialog__close{
      font-size: $baseFontSize;
      @include font_color('color-text-primary');
    }
    .el-dialog__body {
      padding: 30px;
      @include font_color('color-text-regular');
    }

    .el-dialog__footer {
      @include set_one_border('header-menu-hover','top');
      border-bottom-left-radius: 5px;
      -webkit-border-bottom-left-radius: 5px;
      -moz-border-bottom-left-radius: 5px;
      -o-border-bottom-left-radius: 5px;
      border-bottom-right-radius: 5px;
      -webkit-border-bottom-right-radius: 5px;
      -moz-border-bottom-right-radius: 5px;
      -o-border-bottom-right-radius: 5px;
    }
  }
}
